<template>
	<view class="orderT">
		<u-navbar title="出售-订单" :background="{ background: '#a0cfff' }" title-color="#FFFFFF"></u-navbar>
		<u-tabs-swiper ref="tabs" :list="list" bg-color="#a0cfff" inactive-color="#FFFFFF" :is-scroll="false"
			:current="current" @change="tabsChange">
		</u-tabs-swiper>

		<view class="pshC u-p-20">
			<scroll-view :scroll-y="true" v-if="shopList.length > 0">
				<view class="pshSin u-p-20 u-m-b-25" v-for="(item, index) in shopList" :key="index">
					<view class="top">
						<view class="left">
							<u-icon name="home" :size="30" color="rgb(94,94,94)"></u-icon>
							<view class="store">{{item.user.username}}</view>
							<u-icon name="arrow-right" color="rgb(203,203,203)" :size="26"></u-icon>
						</view>
						<view class="right" v-if="item.orderType == '1'">下单</view>
						<view class="right" v-if="item.orderType == '2'">发货</view>
						<view class="right" v-if="item.orderType == '3'">已签收</view>
						<view class="right" v-if="item.orderType == '4'">用户取消</view>
						<view class="right" v-if="item.orderType == '5'">商家取消</view>
						<view class="right" v-if="item.orderType == '6'">用户已评论</view>
						<view class="right" v-if="item.orderType == '7'">商家已评论</view>
						<view class="right" v-if="item.orderType == '8'">退货</view>
						<view class="right" v-if="item.orderType == '9'">退货中</view>
						<view class="right" v-if="item.orderType == '10'">退货失败</view>
						<view class="right" v-if="item.orderType == '11'">退货成功</view>
					</view>
					<view class="item u-m-t-15" @click="getOrderId(item.id)">
						<view class="left">
							<image :src="item.shop.shopUrl" mode="aspectFill"></image>
						</view>
						<view class="content">
							<view class="title u-line-2">{{ item.shop.title }}</view>
							<view class="title u-line-2 u-font-24" style="color: #909399;">{{ item.shop.content }}</view>
							<view class="type">
								<text class="typeTitle">{{ item.lity.listType }}成新</text>
							</view>
							<view class="delivery-time u-m-t-30">时间： {{ item.updateTime }}</view>
						</view>
						<view class="right">
							<view class="price">
								￥{{ item.shop.price }}
								<!-- <text class="decimal">.{{ priceDecimal(item.price) }}</text> -->
							</view>
							<view class="number">x1</view>
						</view>
					</view>
					<view class="total">
						共1件商品 合计:
						<text class="total-price">
							￥{{ item.shop.price }}</text>
						</text>
					</view>
					<view class="bottom">
						<u-button class="u-m-l-30" type="error" shape="circle" size="mini" plain v-if=""
							v-if="item.orderType < 3" @click="orderClick(item.id,5,item.shopId)">取消订单</u-button>
						<u-button class="u-m-l-30" type="primary" shape="circle" size="mini" plain
							v-if="item.orderType == '1'" @click="orderClick(item.id,2,item.shopId)">发货</u-button>
						<u-button class="u-m-l-30" type="error" shape="circle" size="mini" plain
							v-if="item.orderType == '6'" @click="commentClick(item.shop.shopUrl,item.shop.title,item.lity.listType,item.id,7,item.shopId,item.userId)">评论</u-button>
						<u-button class="u-m-l-30" type="info" shape="circle" size="mini" plain
							v-if="item.orderType == '9'" @click="orderClick(item.id,11,item.shopId)">退货接收</u-button>
					</view>
				</view>
			</scroll-view>

			<view v-else>
				<u-empty mode="data" color="#a0cfff" icon-color="#a0cfff"></u-empty>
			</view>
		</view>
	</view>
</template>

<script>
	import helper from '../../common/helper.js'
	import time from '../../common/time.js'
	export default {
		data() {
			return {
				list: [{
						name: '全部',
					}, {
						name: '待发货'
					},
					{
						name: '待收货'
					},
					{
						name: '待评价'
					},
					{
						name: '退货'
					}
				],
				current: 0,
				swiperCurrent: 0,
				shopList: []
			}
		},
		onLoad() {

		},
		created() {
			this.getShop()
		},
		methods: {
			tabsChange(index) {
				this.swiperCurrent = index;
				this.current = index
				this.getShop()
			},
			//获取商品
			getShop() {
				let that = this
				let user = uni.getStorageSync("user")
				var orderID;
				if (that.current == 0) {
					orderID = 0
				}
				if (that.current == 1) {
					orderID = 1
				}
				if (that.current == 2) {
					orderID = 2
				}
				if (that.current == 3) {
					orderID = 3
				}
				if (that.current == 4) {
					orderID = 8
				}
				let data = {
					sellerId: user.id,
					orderType: orderID,
					userId: ''
				}
				that.postRequest(helper.getAllOrder, data).then(res => {
					if (res.data.flag == "200") {
						let serve = res.data
						that.shopList = []
						serve.orderList.forEach((item, index) => {
							if (item.shop.shopUrl.indexOf("<<tupian>>") > 0) {
								item.shop.shopUrl = item.shop.shopUrl.split("<<tupian>>")[0]
								// console.log(index)
							}
							item.creatTime = that.formatDateTime(item.creatTime)
							item.updateTime = that.formatDateTime(item.updateTime)
							that.shopList.push(item)
						})
					}
				})
			},
			orderClick(id, index, shopId) {
				let that = this
				let data = {
					id: id,
					orderType: index,
					shopId: shopId
				}
				var tile;
				if (index == 4) {
					tile = "取消订单"
				}
				if(index == 2){
					tile = "发货"
				}
				that.postRequest(helper.updateOrderType, data).then(res => {
					if (res.data.flag == "200") {
						uni.showToast({
							title: tile + '成功',
							icon: 'none',
							duration: 2000
						})
						that.getShop()
					} else {
						uni.showToast({
							title: tile + '失败',
							icon: 'none',
							duration: 2000
						})
					}
				})
			},
			commentClick(shopUrl, title, lityType, id, index, shopId,userId) {
				uni.navigateTo({
					url: '../comment/sillerComment?id=' + id + "&index=" + index + "&shopId=" + shopId +
						"&shopUrl=" +
						shopUrl + "&title=" + title + "&lityType=" + lityType + "&sellerId=" + userId
				})
			},
			getOrderId(id){
				uni.navigateTo({
					url: '../order/orderXQ?id=' + id + '&type=2'
				})
			}
		},
		watch: {
			current: function() {
				// this.getShop()
			}
		}
	}
</script>

<style>
	page {
		background-color: rgb(240, 240, 240);
	}
</style>
<style lang="scss" scoped>
	.orderT {
		.pshC {
			.pshSin {
				background-color: #FFFFFF;
				border-radius: 12rpx;
				// box-shadow:0px 0px 6px #00000030;
				box-shadow: 5rpx 5rpx -5rpx #FFFFFF;

				.top {
					display: flex;
					justify-content: space-between;

					.left {
						display: flex;
						align-items: center;

						.store {
							margin: 0 10rpx;
							font-size: 32rpx;
							font-weight: bold;
						}
					}

					.right {
						color: $u-type-warning-dark;
					}
				}

				.item {
					display: flex;
					justify-content: space-between;
					// position: absolute;
					// margin: 20rpx 0 0;
					.left {
						width: 200rpx;
						margin-right: 20rpx;

						image {
							width: 200rpx;
							height: 200rpx;
							border-radius: 10rpx;
						}
					}

					.content {
						width: calc(100% -290rpx);
						.title {
							font-size: 28rpx;
							line-height: 50rpx;
						}

						.type {
							margin: 10rpx 0;
							font-size: 24rpx;
							.typeTitle{
								color: #DD524D;
								border: 1rpx solid #DD524D;
								border-radius: 8rpx;
								padding: 5rpx;
							}
						}

						.delivery-time {
							color: #e5d001;
							font-size: 24rpx;
						}
					}

					.right {
						width: 70rpx;
						margin-left: 10rpx;
						padding-top: 20rpx;
						text-align: right;
						float: right;

						.decimal {
							font-size: 24rpx;
							margin-top: 4rpx;
						}

						.number {
							color: $u-tips-color;
							font-size: 24rpx;
						}
					}
				}
				.total {
					margin-top: 20rpx;
					text-align: right;
					font-size: 24rpx;
				
					.total-price {
						font-size: 32rpx;
					}
				}

				.bottom {
					display: flex;
					margin-top: 40rpx;
					padding: 0 10rpx;
					justify-content: flex-end;
					align-items: center;

					.titleTy {
						font-size: 24rpx;
						color: $u-tips-color;
					}
				}

			}
		}
	}
</style>
